<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			let provinces = []
			function init(){
				let xhr = new XMLHttpRequest()
				xhr.open("GET","city.json",false)
				xhr.send()
				let data = xhr.responseText
				provinces = JSON.parse(data)
				for (let i = 0; i < provinces.length; i++) {
					s1.options[i] = new Option(provinces[i].name)
				}
				for (let i = 0; i < provinces[0].cities.length; i++) {
					s2.options[i] = new Option(provinces[0].cities[i])
				}
			}
			function chang(){
				let index = s1.selectedIndex
				s2.length = 0
				for (let i = 0; i < provinces[index].cities.length; i++) {
					s2.options[i] = new Option(provinces[index].cities[i])
			}
			}
		</script>
	</head>
	<body onload="init()">
		请选择：<select id="s1" onchange="change"></select>省
		<select id="s2"></select>市
		<script type="text/javascript">
			const s1 = document.querySelector("#s1")
			const s2 = document.querySelector("#s2")
			
		</script>
	</body>
</html>
